{namespace em=TYPO3\CMS\Extensionmanager\ViewHelpers}
<f:layout name="main" />
<f:section name="content">

    <h1><f:translate key="installedExtensions" /></h1>
    <f:render partial="List/UploadForm" />
    <form class="form-inline">
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <f:form.textfield name="Tx_Extensionmanager_extensionkey" placeholder="{f:translate(key:'extensionList.search')}" id="Tx_Extensionmanager_extensionkey" value="{search}" class="form-control" />
                </div>
            </div>
            <div class="col-sm-6">
                <div class="btn-group pull-right">
                    <f:link.action
                        action="index"
                        controller="List"
                        title="{f:translate(key:'extensionList.filter.showAll')}"
                        arguments="{filter:''}"
                        class="btn btn-default {f:if(condition: '{backendUserFilter} == All', then: 'active')}"
                        style="width: 80px;">
                        <f:translate key="extensionList.filter.showAll" />
                    </f:link.action>
                    <f:link.action
                        action="index"
                        controller="List"
                        arguments="{filter:'System'}"
                        title="{f:translate(key:'extensionList.filter.showSystemExtensions')}"
                        class="btn btn-default {f:if(condition: '{backendUserFilter} == System', then: 'active')}"
                        style="width: 80px;">
                        <f:translate key="extensionList.filter.showSystemExtensions" />
                    </f:link.action>
                    <f:link.action
                        action="index"
                        controller="List"
                        arguments="{filter:'Local'}"
                        title="{f:translate(key:'extensionList.filter.showLocalExtensions')}"
                        class="btn btn-default {f:if(condition: '{backendUserFilter} == Local', then: 'active')}"
                        style="width: 80px;">
                        <f:translate key="extensionList.filter.showLocalExtensions" />
                    </f:link.action>
                </div>
            </div>
        </div>
    </form>
    <br>
    <div class="table-fit">
        <table id="typo3-extension-list" class="table table-striped table-hover extension-list">
            <thead>
                <tr>
                    <th title="{f:translate(key:'extensionList.header.title.update')}"><f:translate key="extensionList.header.update"/></th>
                    <th title="{f:translate(key:'extensionList.header.title.activate')}"><f:translate key="extensionList.header.activate"/></th>
                    <th data-filterable><f:translate key="extensionList.header.extensionName"/></th>
                    <th data-filterable data-sort-default><f:translate key="extensionList.header.extensionKey"/></th>
                    <th data-sort-method="dotsep"><f:translate key="extensionList.header.extensionVersion"/></th>
                    <th data-sort-method="none"><f:translate key="extensionList.header.extensionState"/></th>
                    <th><f:translate key="extensionList.header.extensionType"/></th>
                    <th data-sort-method="none"><f:translate key="extensionList.header.extensionActions"/></th>
                </tr>
            </thead>
            <tbody>
                <f:for each="{extensions}" as="extension" key="extensionKey">
                    <f:variable name="updateIsBlocked" value="{f:if(condition: '{isComposerMode} || {settings.offlineMode} || {extension.state} == \'excludeFromUpdates\'', then: '1', else: '0')}" />
                    <f:variable name="sortUpdate" value="0" />
                    <f:variable name="sortUpdate" value="{f:if(condition: '{extension.updateAvailable} && {updateIsBlocked}', then: '1')}" />
                    <f:variable name="sortUpdate" value="{f:if(condition: '{extension.updateAvailable} && !{updateIsBlocked}', then: '2')}" />
                    <f:if condition="{extension.terObject}">
                        <f:then>
                            <tr role="row" id="{extensionKey}" class="{f:if(condition:'{extension.terObject.reviewState} == -1', then:'insecure')}{f:if(condition:'{extension.terObject.reviewState} == -2', then:'outdated')} {f:if(condition:'{extension.installed}', then: '', else: 'inactive')}">
                        </f:then>
                        <f:else>
                            <tr role="row" id="{extensionKey}" class="{f:if(condition:'{extension.installed}', then: '', else: 'inactive')}">
                        </f:else>
                    </f:if>
                    <td data-sort="{sortUpdate}">
                        <f:if condition="{extension.updateAvailable}">
                            <f:if condition="{updateIsBlocked}">
                                <f:then>
                                    <span class="btn btn-default disabled" title="{f:translate(key:'extensionList.updateDisabled')}">
                                        <core:icon identifier="actions-system-extension-update" />
                                    </span>
                                </f:then>
                                <f:else>
                                    <f:link.action action="updateCommentForUpdatableVersions"
                                        class="btn btn-default"
                                        additionalAttributes="{data-action:'update-extension'}"
                                        format="json" controller="Download"
                                        arguments="{extension:extension.key, integerVersionStart: extension.terObject.integerVersion, integerVersionStop: extension.updateToVersion.integerVersion}"
                                        title="{f:translate(key:'extensionList.updateToVersion', arguments:'{0:extension.updateToVersion.version}')}"
                                    >
                                        <core:icon identifier="actions-system-extension-update" />
                                    </f:link.action>
                                </f:else>
                            </f:if>
                        </f:if>
                    </td>
                    <td data-sort="{f:if(condition: extension.installed, then: 'active', else: 'inactive')}">
                        <em:toggleExtensionInstallationState extension="{extension}" />
                    </td>
                    <td>
                        <f:if condition="{extension.icon}">
                            <img class="extension-icon" src="{extension.icon}" alt="" />
                        </f:if>
                        <span title="{extension.description}">{extension.title}</span>
                    </td>
                    <td>{extensionKey}</td>
                    <td>{extension.version}</td>
                    <td><span class="label label-{extension.state}">{extension.state}</span></td>
                    <td>{extension.type}</td>
                    <td>
                        <div class="btn-group">
                            <em:processAvailableActions extension="{extension}">
                                <em:updateScript class="btn btn-default" extensionKey="{extension.key}" />
                                <f:if condition="!{isComposerMode}">
                                    <em:removeExtension class="btn btn-default" extension="{extension}" />
                                </f:if>
                                <f:link.action action="downloadExtensionZip" controller="Action" arguments="{extension:extension.key}" title="{f:translate(key:'extensionList.downloadzip')}" class="btn btn-default">
                                    <core:icon identifier="actions-system-extension-download" />
                                </f:link.action>
                                <em:reloadSqlData class="btn btn-default" extension="{extension}" />
                                <f:if condition="{extension.terObject.documentationLink}">
                                    <f:then>
                                        <a href="{extension.terObject.documentationLink}" target="_blank" rel="noopener noreferrer" class="btn btn-default">
                                            <core:icon identifier="actions-system-extension-documentation" size="small" />
                                        </a>
                                    </f:then>
                                    <f:else>
                                        <span class="btn btn-default disabled"><core:icon identifier="empty-empty" size="small" /></span>
                                    </f:else>
                                </f:if>
                            </em:processAvailableActions>
                        </div>
                    </td>
                    </tr>
                </f:for>
            </tbody>
        </table>
    </div>

</f:section>
